df = 
    display flex

.flex
    {df}

    &-1
        flex 1

    &-2
        width 50%
        flex 0 0 50%

    &-3
        width 33.333%
        flex 0 0 33.333%

    &-4
        width 25%
        flex 0 0 25%

    &-column
        {df}
        flex-direction column

    &-wrap
        {df}
        flex-wrap wrap

    &-ac
        {df}
        align-items center

    &-ae
        {df}
        align-items flex-end

    &-as
        {df}
        align-items stretch

    &-jc
        {df}
        justify-content center

    &-je
        {df}
        justify-content flex-end

    &-jsb
        {df}
        justify-content space-between

    &-jsa
        {df}
        justify-content space-around

    &-jc-ac
        @extend .flex-jc;
        @extend .flex-ac;
